<script setup lang="ts">
  import {sha256} from "js-sha256";
  import axios from "axios";
  import macros from "../macros";
  import {router} from "../main.js";
  var user:string;
  var password:string;
  var passwordHash:string;
  function submit(){
    passwordHash=sha256(password);
    var userinfo={
      username: user,
      password: passwordHash
    }
    axios.post(macros.server+"/api/login",userinfo).then(function (response){
      if(response.data.data=="Authenticated"){
        window.sessionStorage.setItem("isAuthenticated","true");
        router.push("/admin");
      }else{
        alert("登录失败");
      }
    }).catch(function (error){
      alert(error);
      console.log(error);
    });
  }
</script>

<template>
  <h2>请登录</h2>
  <form style="width: 30rem;margin: auto"  class="input" method="post">
    <lable for="username" class="form-label text-light">用户名：</lable>
    <input v-model="user" type="text" class="form-control" id="username" placeholder="用户名" name="username">
    <br/>
    <lable for="password" class="form-label text-light">密码：</lable>
    <input v-model="password" type="password" class="form-control" id="password" placeholder="密码" name="password">
    <div style="text-align: center">
      <button @click="submit" type="button" class="btn btn-outline-light text-light" style="margin: 1rem">登录</button>
    </div>
  </form>
</template>

<style scoped>
.input{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
}
</style>